﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>思维导图</title>  
    <link rel="stylesheet" href="../jscommon/umychart.resource/css/tools.css" />
    <link rel="stylesheet" href="../jscommon/umychart.resource/font/iconfont.css" />
    <!-- 使用阿里云图片 -->
    <!--<link rel="stylesheet" href="https://at.alicdn.com/t/font_1040563_1d1tgaoqofpi.css" />-->
    
</head>  
<body>
    <div id="jsmind" style="width: 900px;height:600px;position: relative;"></div>

    <script src="content/js/jquery.min.js"></script>
    <script src="content/js/webfont.js"></script>
    <script src="../jscommon/umychart.js"></script>
    <script src="../jscommon/umychart.complier.js"></script>
    <script src="../jscommon/umychart.index.data.js"></script>
    <script src="../jscommon/umychart.style.js"></script>
    
     <!-- 引入vConsole的JS库 -->
     <script src="../vConsole-3.2.0/dist/vconsole.min.js"></script>
    
    <script>

        //预加载下阿里云图片
        //WebFont.load({ custom: { families: ['iconfont'] } });

        var JSMIND_NODE_TREE=
        {
            Root:
            [
                {   Type:JSMIND_NODE_ID.TEXT_NODE, Name:"财务节点", ID:'root-1', Title:"财务分析", Content:'财务数据分析demo', Position: { X:300,Y:20, Width:150, Height:50} ,
                    Children: 
                    [ 
                        { Type:JSMIND_NODE_ID.TABLE_NODE, Name:"财务节点1", ID:'child-1', Title:"2017一季度报财务数据", Position: { X:50,Y:250, Width:200, Height:500}, ShowMode:2 ,
                            Index: //指标脚本
                            { Name:'财务数据脚本', Args:[ { Name:'YY', Value:2017} ], IsSectionMode:true,
                                Script: //脚本
                                "营业总收入:SF(YY,1,'营业总收入');\n"+
                                "每股收益:SF(YY,1,'每股收益');\n"+
                                "每股净资产:SF(YY,1,'每股净资产');\n"+
                                "毛利率:SF(YY,1,'毛利率');\n"+
                                "资产总计:SF(YY,1,'资产总计');\n"+
                                "净利润:SF(YY,1,'净利润');\n"+
                                "营业利润:SF(YY,1,'营业利润');" 
                            }
                        },
                        { Type:JSMIND_NODE_ID.TABLE_NODE, Name:"财务节点2", ID:'child-2', Title:"2018一季度财务数据", Position: { X:250+50,Y:250, Width:200, Height:500}, ShowMode:2 ,
                            Index: //指标脚本
                            { Name:'财务数据脚本', Args:[ { Name:'YY', Value:2018} ], IsSectionMode:true,
                                Script: //脚本
                                "营业总收入:SF(YY,1,'营业总收入');\n"+
                                "每股收益:SF(YY,1,'每股收益');\n"+
                                "每股净资产:SF(YY,1,'每股净资产');\n"+
                                "毛利率:SF(YY,1,'毛利率');\n"+
                                "资产总计:SF(YY,1,'资产总计');\n"+
                                "净利润:SF(YY,1,'净利润');\n"+
                                "营业利润:SF(YY,1,'营业利润');" 
                            }
                        },
                        { Type:JSMIND_NODE_ID.TABLE_NODE, Name:"财务节点3", ID:'child-3', Title:"2019一季度财务数据", Position: { X:250*2+50,Y:250, Width:200, Height:500}, ShowMode:2 ,
                            Index: //指标脚本
                            { Name:'财务数据脚本', Args:[ { Name:'YY', Value:2019} ], IsSectionMode:true,
                                Script: //脚本
                                "营业总收入:SF(YY,1,'营业总收入');\n"+
                                "每股收益:SF(YY,1,'每股收益');\n"+
                                "每股净资产:SF(YY,1,'每股净资产');\n"+
                                "毛利率:SF(YY,1,'毛利率');\n"+
                                "资产总计:SF(YY,1,'资产总计');\n"+
                                "净利润:SF(YY,1,'净利润');\n"+
                                "营业利润:SF(YY,1,'营业利润');" 
                            }
                        },
                        { Type:JSMIND_NODE_ID.TABLE_NODE, Name:"财务节点4", ID:'child-4', Title:"最近三年一季度财务分析", Position: { X:290,Y:580, Width:200, Height:500}, ShowMode:1 ,
                            Index: //指标脚本
                            { Name:'财务数据脚本', Args:[ { Name:'YY', Value:2019} ], IsSectionMode:true,
                                Script: //脚本
                                    "DATA2017=SF(YY-2,1,'净利润');\n" +
                                    "DATA2018=SF(YY-1,1,'净利润');\n" +
                                    "DATA2019=SF(YY,1,'净利润');\n" +
                                    "净利润比上一年:IF(DATA2019>DATA2018, '增加','减少');\n" +
                                    "净利润连续增长:IF( DATA2019>DATA2018 AND DATA2018>DATA2017, '是','否');",
                            }
                        }
                    ] 
                }
            ],
            //连线
            Lines:
            [ 
                { Start:'root-1', End:'child-1', Type:0 }, 
                { Start:'root-1', End:'child-2', Type:0 },
                { Start:'root-1', End:'child-3', Type:0 },

                { Start:'child-1', End:'child-4', Type:0 },
                { Start:'child-2', End:'child-4', Type:0 },
                { Start:'child-3', End:'child-4', Type:0 }
            ]
        }

        
        $(window).resize(resizeCanvas);
        
        function resizeCanvas()
        {
            var height= $(window).height();
            var width = $(window).width();
            var divJsMind=document.getElementById('jsmind');
            divJsMind.style.top=0+'px';
            divJsMind.style.left=0+'px';
            divJsMind.style.width=width+'px';
            divJsMind.style.height=height+'px';
            divJsMind.JSMind.OnSize();
        }
        
        
        $(function ()
        {
            var option=
            {
                NodeTree:JSMIND_NODE_TREE,
                Symbol:'600000.sh'
            };

            var chart=JSMind.Init(document.getElementById('jsmind'));
            chart.SetOption(option);

            /*
            var node={Name:"财务节点", Title:"2018一季度财务分析", Position: { X:50,Y:20, Width:150, Height:50} };
            chart.AddTextNode(node);

            var node={Name:"财务节点2", Title:"2017一季度财务分析", Position: { X:50,Y:400, Width:200, Height:500}, ShowMode:2 };
            var tableNode =chart.AddTableNode(node);

            var node={Name:"财务节点2", Title:"2016一季度财务分析", Position: { X:50,Y:700, Width:200, Height:500}, ShowMode:1 };
            var tableNode =chart.AddTableNode(node);
            */
            

            chart.JSMindContainer.Draw();

            resizeCanvas();
        
        })

    </script>  
</body>  
</html>